<template>
	<div class="easyd-weixin-Box">

		<div class="app_page_box" style="bottom: 50px;">
			<div class="app_page" v-for="(item,index) in followData.followUpRecord" v-if="times>0">
				<div class="app_list_box MARGIN_BOTTOM_10">

					<div class="app_box_content">
						<div class="app_box_content_left">
							第{{times-index}}次跟进
						</div>
						<div class="app_box_content_right">
							<span class="fa fa-angle-right fa-lg"></span>
						</div>
					</div>

					<div class="history_follow_info">
						<div class="app_box_flex">
							<div class="app_box_flex_1 C4">
								跟进方式：
							</div>
							<div class="app_box_flex_2" v-if="item.cfr_way == 0">
								电话沟通
							</div>
							<div class="app_box_flex_2" v-if="item.cfr_way == 1">
								到店跟进
							</div>
						</div>
						<div class="app_box_flex">
							<div class="app_box_flex_1 C4">
								沟通结果：
							</div>
							<div class="app_box_flex_2">
								{{item.cfr_content}}
							</div>
						</div>
						<div class="app_box_flex" v-if="item.cfr_next_time>0">
							<div class="app_box_flex_1 C4">
								下次跟进：
							</div>
							<div class="app_box_flex_2">
								<span v-if="item.cfr_next_time>0">{{$common.getTimes(item.cfr_next_time)}}</span>
								<span style="color: red;" v-else>放弃跟进</span>
							</div>
						</div>
					</div>

					<div class="app_box_content" style="border-bottom: 0;">
						<div class="app_box_content_left">
							<span class="C4 T4">{{$common.getTimes(item.cfr_create_time)}}</span>
						</div>
						<div class="app_box_content_right">
							跟进人：{{item.cfr_name}}
						</div>
					</div>
					<div class="app_box_content" v-if="item.cfr_comment!=''&& item.cfr_comment!=null" style="margin-top:-10px;line-height:30px;" v-html="item.cfr_comment + ' (' + item.cfr_comment_user + ')'"></div>
					<div class="app_box_content" v-else>
						<div v-if="$userData.getIsManager() == 1" class="commentButton T3 C4" @click="addComment(item.cfr_id,item.cfr_uid)">添加点评</div>
					</div>
					<div @click="deleteComment(item.cfr_id)" v-if="item.cfr_comment!=''&& item.cfr_comment!=null && $userData.getIsManager() == 1" style="height:40px;text-align:center;line-height:40px;background:#fefefe">删除点评</div>

				</div>
			</div>
		</div>
		<div class="app_bottom_box">
			<div class="app_bottom_box_right" @click="addFollow()">
				添加跟进备注
			</div>
		</div>

	</div>
</template>

<script>
	import { mapState, mapMutations } from "vuex";

	export default {

		data() {
			return {
				times: 0,
			};
		},
		computed: {
			...mapState({
				followData: state => state.HistoryFollowModule.followData,
			})
		},
		mounted() {
			this.initData();
		},
		methods: {
			deleteComment(id){

				this.$easyUtil.confirm(this,'删除确认','您确定要删除该点评吗',()=>{

						var param = {
                    update_where: 'cfr_id',
                    cfr_id: id,
                    cfr_comment: "",
                };

                console.log(param);
                // return;
                this.$easyUtil.startLoading(this)
                this.$http.postHttp(this.$API.updateArtCustomerFollowRecord, param, (rs) => {

                    this.$easyUtil.endLoading(this)
										this.$easyUtil.successToast(this, '点评删除成功');
										this.initData();

                })
          
        })

				
				
			},	
			initData() {
				this.$easyUtil.startLoading(this);
				this.$http.getHttp(
					this.$API.apiFollowUpRecordList + "/customerId/" + this.$route.query.customerId,
					rs => {
						this.$easyUtil.endLoading(this);
						console.log(rs);
						this.$store.commit("HistoryFollowModule/updateFollowData", rs);
						this.times = this.followData.followUpRecord.length;
					}
				);
			},

			//添加跟进记录
			addFollow(e) {
				this.$easyUtil.GO(this, '/addFollow', {
					customerId: this.$route.query.customerId
				})
			},
			//添加点评
			addComment(id,uid) {
				this.$easyUtil.GO(this, '/commentFollow', {
					id: id,
					uid : uid,
					customerId : this.$route.query.customerId
				})
			}
		}
	};
</script>

<style lang="stylus" scoped>
	@import '~PUBLIC_CSS';
	.history_follow_info {
		padding: 10px;
		border-bottom: 1px solid #f1f1f1;
	}
	
	.history_follow_info .app_box_flex {
		padding-bottom: 5px
	}
	
	.history_follow_info .app_box_flex:last-child {
		padding-bottom: 0
	}
	
	.commentButton {
		border: 1px dashed #fbd417;
		border-radius: 5px;
		height: 14px;
		line-height: 14px;
		padding: 8px 15px;
		margin: 10px auto 20px;
	}
</style>